<div class="chart_parent">
  <span class="chart__data js_chart__data">Hey</span>
  <canvas id="myChart" class="chart__diagram" width="400" height="400"></canvas>
</div>


.chart_parent {
  position:relative;
  height:400px;
}
.chart__data {
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  font-size: 40px;
  height: 40px;
  width: 400px;
  position: absolute;
  top: 50%;
  margin-top:-20px;
  z-index: 100;
}
.chart__diagram { position: absolute; z-index: 10;}



// Get context with jQuery - using jQuery's .get() method.
var ctx = $("#myChart").get(0).getContext("2d");// This will get the first returned node in the jQuery collection.
/*var myNewChart = new Chart(ctx);*/
var data = [
    {
        value: 300,
        color:"#F7464A",
        highlight: "#FF5A5E",
        label: "Red"
    },
    {
        value: 50,
        color: "#46BFBD",
        highlight: "#5AD3D1",
        label: "Green"
    },
    {
        value: 100,
        color: "#FDB45C",
        highlight: "#FFC870",
        label: "Yellow"
    }
];
var options ={
    //Boolean - Whether we should show a stroke on each segment
    segmentShowStroke : true,

    //String - The colour of each segment stroke
    segmentStrokeColor : "#fff",

    //Number - The width of each segment stroke
    segmentStrokeWidth : 2,

    //Number - The percentage of the chart that we cut out of the middle
    percentageInnerCutout : 50, // This is 0 for Pie charts

    //Number - Amount of animation steps
    animationSteps : 100,

    //String - Animation easing effect
    animationEasing : "easeOutBounce",

    //Boolean - Whether we animate the rotation of the Doughnut
    animateRotate : true,

    //Boolean - Whether we animate scaling the Doughnut from the centre
    animateScale : false,

    //String - A legend template
    legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<segments.length; i++){%><li><span style=\"background-color:<%=segments[i].fillColor%>\"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>"

};
var myDoughnutChart = new Chart(ctx).Doughnut(data,options);
